@use "../../assets/scss/mixins/figure/flag" as fg;
@use "../../assets/scss/mixins/base" as mx;

body {
  width: 100%;
  height: 100vh;
}

.element {
  position: relative;
  @include mx.rect(150px, 130px, #f0ede8, 8px);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
  display: inline-block;
  border: 1px solid #ccc;
}
.horiz-flag {
  @include fg.flag(#548ec1, #f0ede8, 40px, right, true);
  top: 10px;
  color: #fff;
}
.vert-flag {
  @include fg.flag(#911, #f0ede8, 50px, bottom);
  left: 10px;
  color: #fff;
}
